<template>
  <!-- 这是数据统计下的数据报表的数据图标 -->
  <div ref="China" id="China"></div>
</template>

<script>
import * as echarts from "echarts";
import { Eractor } from "../../../api/user";
export default {
  name: "DataStats",
  data() {
    return {
      obj: [],
    };
  },
  mounted() {
    Eractor().then((res) => {
      this.obj = res.data.data;
      var myChart = echarts.init(document.getElementById("China"));
      myChart.setOption({
        title: {
          text: "用户信息",
        },
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "cross",
            label: {
              backgroundColor: "#6a7985",
            },
          },
        },
        legend: {
          data: this.obj.legend.data,
        },
        toolbox: {
          feature: {
            saveAsImage: {},
          },
        },
        grid: {
          left: "3%",
          right: "4%",
          bottom: "3%",
          containLabel: true,
        },
        xAxis: this.obj.xAxis,
        yAxis: this.obj.yAxis,
        series: this.obj.series,
      });
    });
  },
};
</script>

<style>
#China {
  width: 1400px;
  height: 800px;
  margin: 0 auto;
}
</style>